<template>
  <el-card class="mt-20 mr-20" shadow="never">
    <el-form :disabled="permissionDisabled()" ref="formRef" :rules="rules" :model="form" label-width="200px" label-position="left" class="form-readonly">
      <el-form-item :label="$t('pageStr.enableSNMP')">
        <el-switch v-model="form.enabled" active-value="1" inactive-value="0"></el-switch>
      </el-form-item>
      <div v-if="form.enabled == '1'">
        <el-form-item :label="$t('pageStr.snmpServerPortStr')" prop="serverport" style="max-width: 500px">
          <el-input v-model="form.serverport" clearable/>
        </el-form-item>
        <el-form-item :label="$t('pageStr.snmpCommunityStr')" prop="community" style="max-width: 500px">
          <el-input v-model="form.community" clearable/>
        </el-form-item>
        <el-form-item :label="$t('pageStr.snmpTrapIpStr')" prop="trapip" style="max-width: 500px">
          <el-input v-model="form.trapip" clearable/>
        </el-form-item>
        <el-form-item :label="$t('pageStr.snmpTrapPortStr')" prop="trapport" style="max-width: 500px">
          <el-input v-model="form.trapport" clearable/>
        </el-form-item>
      </div>
    </el-form>
  </el-card>
  <el-button v-permissionShow style="margin-top: 20px;width: 110px;color: #fff" color="#C29B74" @click="handleSubmit">{{ $t('tabsStr.applyStr') }}</el-button>
</template>

<script setup>
import {ref,onBeforeMount} from 'vue'
import {reqGetSnmp, reqSetSnmp} from '@/api/application/snmp-set'
import {ElMessage} from "element-plus";
import {useI18n} from 'vue-i18n'
import { permissionDisabled } from '@/utils'
const {t} = useI18n()
const formRef = ref(null)
const rules = {}
const form = ref({
  enabled: '',
  serverport: '',
  community: '',
  trapip: '',
  trapport: ''
})

function getData() {
  reqGetSnmp().then((res) => {
    form.value = res.snmpCfg
    console.log('读取snmp', form.value)
  })
}
onBeforeMount(getData)

function handleSubmit() {
  formRef.value.validate((valid) => {
    if (valid) {
      console.log('应用按钮', form.value)
      reqSetSnmp(form.value).then(() => {
        ElMessage.success(t('successTip'))
      }).catch(() => {
        ElMessage.error(t('errorTip'))
      })
    }
  })
}
</script>

<style scoped>
</style>